//useEffect是一个React Hook函数，用于在React组件中创建不是由事件引起而是由渲染本身引起的操作,比如发送AJAX请求，更改DOM等等

import { useEffect, useState } from "react";

const URL = "http://geek.itheima.net/v1_0/channels"

function App() {
  const [ list, setList ] = useState([])
  
  useEffect(()=>{
    //额外的操作 获取频道列表
    async function getList(){
      const res = await fetch(URL)
      const jsonRes = await res.json()
      console.log(jsonRes);
      setList(jsonRes.data.channels);
    }
    getList()
  },[])
  return (
    <div className="App">
      this is a app,
      <ul>
        { list.map(item => <li key={item.id}>{item.name}</li>) }
      </ul>
    </div>
  );
}

export default App;
